@import "~react-grid-layout/css/styles.css";
@import "~react-resizable/css/styles.css";

.c7n-workbench {
  &-wrapper {
    display: flex;
    flex-direction: column;
    padding: 16px 20px 20px 20px;
    background: #f5f6fa;
    .c7nagile-detail-container{
      z-index:20 !important;
    }
    .react-grid-item.react-grid-placeholder {
      background: rgba(14, 29, 128, 20);
      border-radius: 10px;
    }

    &-view {
      height: calc(100vh - 0.48rem - 1.08rem);
      overflow-y: scroll;
    }

    &-edit {
      height: calc(100vh - 0.48rem - 0.56rem);
      overflow-y: scroll;
    }
  }

  &-container {
    position: relative;
    flex-shrink: 0;
    flex-grow: 1;
    height: auto;
  }

  &-layout {
    // overflow-y: scroll;
    min-height: 100%;
    height: inherit;
    margin-bottom: 40px;
    &::-webkit-scrollbar {
      width: 0;
    }
  }

  // .spin-container {
  //   width: auto !important;
  //   height: 100% !important;
  // }
}

.c7n-workbench-empty-span {
  color: var(--text-color3);
  line-height: 0.18rem;
  padding-top: 0.1rem;
  margin-bottom: 0.47rem;
  text-align: center;
  border-top: 1px solid;
  border-image:
    linear-gradient(
        to right,
        rgba(216, 220, 235, 0.4),
        rgba(216, 220, 235, 1),
        rgba(216, 220, 235, 0.4)
      )
      1 10;
}
